<template>
  <div class="nav_container">
  	<div class="nav_img_container">
  		<img src="../assets/img/back.png" class="nav_img" v-if="showBack" v-on:click="back()"/>
  	</div>
		<div class="nav_title">{{title}}</div>
  </div>
</template>

<script>
  export default {
    name: 'Nav',
    props: {
      title: String,
      showBack: Boolean,
      url: String//跳转路径
    },
	methods: {
	  back(){
      let that = this
      console.log(that.url)
      if(that.url){
        that.$router.push({
          path: that.url
        })
      }else{
        that.$router.go(-1)
      }
	  	
	  }
	}
  }
</script>

<style scoped>
  .nav_container{
    position: fixed;
    width: 100%;
    background: #fff;
    box-shadow: 2px 2px 12px #ccc;
    left: 0;
    top: 0;
    z-index: 300;
    display: flex;
    height: 8vh;
    font-size: 32px;
    font-weight: 550;
    display: flex;
    align-items: center;
	}
	
	.nav_img_container{
		width: 50px;
		display: flex;
		justify-content: flex-end;
	}
	
	.nav_img{
		height: 40px;
		width: 40px;
		/*margin-left: 10px;*/
	}
	
	.nav_title{
		width: 95vw;
    text-align: center;
	}
</style>